import React, { Component } from 'react';
import { connect } from 'react-redux';
import addTodoReducers from '../../reducers/addTodo';
import actionCreator from '../../actions';

class AddTodo extends Component {
    constructor(props) {
        super(props);
        this.state = {
            count: 0
        }
    }

    render() {
        return (
            <div> 
                <button onClick={ this.props.addCount }> + </button>
                <span> {this.props.count} </span>
                <button onClick={ this.props.minusCount }> - </button>
            </div>
        )
    }
}

// 进入组件，初始化时，state由reducer生成，从这里计入到组件
const mapStateToProps = (state) => {
    return {
        count: state.count
    }
}

// 动作从这里触发，传到reducer，返回相应的state，从而引起组件的更新。注意，这里初始化时，这个方法就会被记录。
const mapDispatchToProps = (dispatch) => {
    return {
        addCount: () => dispatch(actionCreator("ADD_TODO")),
        minusCount: () => dispatch(actionCreator("MINU_TODO"))
    }
}


export default connect(mapStateToProps, mapDispatchToProps)(AddTodo);